import React from 'react'
import MouseListener from './MouseListener'


const renderPoint = mouse => <>
    横坐标X: {mouse.x}, 纵坐标Y: {mouse.y}
</>

const renderDiv = mouse => <div style={{
    height: 100,
    width: 100,
    backgroundColor: '#008C8C',
    position: 'absolute',
    left: mouse.x ? mouse.x - 50 : 0,
    top: mouse.y ? mouse.y - 50 : 0
}}></div>

export default function Test() {

    return (
        <div>
            <MouseListener render={renderPoint} />
            <MouseListener render={renderDiv} />
        </div>
    )
}
